<template>
  <div>
    <br />
    <a-card title="图形码" size="small">
      <a-row>
        <a-col span="2">二维码</a-col>
        <a-col span="22">
          <a-button
            class="btn"
            type="primary"
            size="small"
            @click="$refs.QRCode.show()"
          >
            二维码生成
          </a-button>
          <a-button
            class="btn"
            type="primary"
            size="small"
            @click="$refs.QRCodeIdentify.show()"
          >
            二维码识别
          </a-button>
        </a-col>
      </a-row>
      <br />
      <a-row>
        <a-col span="2">条形码</a-col>
        <a-col span="22">
          <a-button
            class="btn"
            type="primary"
            size="small"
            @click="$refs.BarCode.show()"
          >
            条形码生成
          </a-button>
        </a-col>
      </a-row>
    </a-card>
    <q-r-code ref="QRCode" />
    <bar-code ref="BarCode" />
    <q-r-code-identify ref="QRCodeIdentify" />
  </div>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator'
import QRCode from '@/components/web/tool/imgCode/qrcode'
import BarCode from '@/components/web/tool/imgCode/barcode'
import QRCodeIdentify from '@/components/web/tool/imgCode/qrcode/identify'

@Component({
  name: 'ComWebToolImgCode',
  components: {
    QRCode,
    BarCode,
    QRCodeIdentify
  }
})
export default class ComWebToolImgCode extends Vue {}
</script>

<style scoped></style>
